<template>
  <el-dialog
    v-if="openForm"
    v-model="openBoole"
    :close-on-click-modal="false"
    custom-class="mydialog"
    width="50%"
    :title="title"
    @close="close"
  >
    <el-form
      ref="openRef"
      :model="openForm"
      :rules="rules"
      label-width="110px"
      size="small"
    >
      <el-row gutter="40">
        <el-col :span="24">
          <el-form-item
            label="审批结论"
            prop="radio"
          >
            <el-radio-group
              v-model="openForm.radio"
              @change="handlRadio"
            >
              <el-radio
                v-for="item in approvalData"
                :key="item.value"
                :label="item.value"
              >{{ item.label }}
              </el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item
            label="审批意见"
            prop="textarea"
          >
            <el-input
              v-model="openForm.textarea"
              type="textarea"
              :autosize="{ minRows: 2, maxRows: 4}"
              placeholder="请输入内容"
            />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item
            label="附件"
            prop="file"
          >
            <upload-file-view
              ref="uploadFileView"
              v-model:file-arr="openForm.files"
            />
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <template #footer>
      <div
        class="dialog-footer"
        style="display:flex;justify-content:center;align-items:center;"
      >
        <el-button
          class="border-btn"
          size="small"
          style="margin-right: 20px;"
          @click="close"
        >取消
        </el-button>
        <el-button
          class="main-btn"
          size="small"
          type="primary"
          @click="handlSubmit"
        >确定
        </el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script>
import {getCurrentInstance, inject, reactive, toRefs} from 'vue'
import {crmStore} from '@CRM/store'

export default {
  name: 'Index',
  emits: ['succsess'],
  setup(props, context) {
    const api = inject('api')
    var data = reactive({
      openBoole: false,
      title: '审批',
      openForm: {
        radio: '',
        textarea: '',
        files: [],
      },
      currentTask: {},
      rules: {
        radio: [
          { required: true, message: '请选择审批结论', trigger: 'change' },
        ],
      },
      openRef: null,
      approvalData: [],
      userId: crmStore.getters['user/userInfo'].ID,
    })
    const currentInstance = getCurrentInstance()

    const close = () => {
      data.openBoole = false
      data.openRef.clearValidate()
      data.openRef.resetFields()
    }

    const open = (val, obj) => {
      data.openForm = {
        radio: '',
        textarea: '',
        files: [],
      }
      data.currentTask = {
        taskId: val.taskId,
        form: {
          result: {
            value: '',
            type: 'string',
            valueInfo: {},
          },
        },
      }
      getApprovalResultList(val.taskId)
      data.openBoole = true
    }

    const handlRadio = (val) => {
      data.currentTask.form.result.value = val
    }

    const handlFile = () => {
      data.openForm.files.forEach((item) => {
        item.code = ''
        item.isLong = 1
        item.isNeed = 1
        item.type = 1
        item.validTime = ''
      })
    }

    const getApprovalResultList = (taskId) => {
      api.approval.APPROVAL_RESULT_LIST({ taskId: taskId }).then((res) => {
        if (res.code === 0) {
          data.approvalData = res.data
        }
      })
    }

    const handlSubmit = () => {
      handlFile()
      data.openRef.validate((valid) => {
        if (valid) {
          const dataList = {
            taskId: data.currentTask.taskId,
            form: data.currentTask.form,
            message: data.openForm.textarea,
            files: data.openForm.files,
          }
          api.approval.APPROVAL_SUBMIT(dataList).then((res) => {
            if (res.code === 0) {
              context.emit('succsess')
              currentInstance.proxy.customMessage({
                type: 'success',
                message: '操作成功',
              })
              close()
            } else {
              currentInstance.proxy.customMessage({
                type: 'error',
                message: res.msg,
              })
            }
          })
        }
      })
    }

    return {
      ...toRefs(data),
      open,
      close,
      handlSubmit,
      handlRadio,
    }
  },
}
</script>

<style scoped>
/* @import url(); 引入css类 */
</style>
